<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.prime.com.tr/ui"
	template="../pages/template.xhtml">
	<ui:define name="head">
		<title>#{msg.demandasTitle}</title>
	</ui:define>
	<ui:define name="left"></ui:define>
	<ui:define name="center">
		<h:form prependId="false" styleClass="formPrincipal">
			<p:ajaxStatus style="width:16px;height:16px;">
				<f:facet name="start">
					<h:graphicImage value="../images/loading.gif" />
				</f:facet>
				<f:facet name="complete">
					<h:outputText value="" />
				</f:facet>
			</p:ajaxStatus>
			<p:growl id="msgs" showDetail="true" />
			<p:panel header="#{msg.buscar}" id="buscar">
				<h:panelGrid columns="7">
					<h:outputLabel value="#{msg.usuario}: "></h:outputLabel>
					<p:inputText id="usuario" value="#{demandasBean.cadenaUsuario}">
						<p:ajax event="keyup" update="demandas,listadoDemandas"
							listener="#{demandasBean.buscar}" />
					</p:inputText>
					<h:outputLabel value="#{msg.tecnico}: "></h:outputLabel>
					<p:inputText id="tecnico" value="#{demandasBean.cadenaTecnico}">
						<p:ajax event="keyup" update="demandas,listadoDemandas"
							listener="#{demandasBean.buscar}" />
					</p:inputText>
					<h:outputLabel value="#{msg.departamento}: "></h:outputLabel>
					<h:panelGrid columns="2">
						<p:selectOneMenu value="#{demandasBean.departamento}"
							effect="fade">
							<f:selectItem itemLabel="#{msg.seleccioneDepartamento}" itemValue="" />
							<f:selectItems value="#{demandasBean.nombreDepartamentos}" />
							<p:ajax update="demandas,listadoDemandas"
								listener="#{demandasBean.buscar}" />
						</p:selectOneMenu>
					</h:panelGrid>
					<p:commandLink value="#{msg.limpiar}" action="#{demandasBean.limpiar}"
						update="@form"></p:commandLink>
				</h:panelGrid>
			</p:panel>
			<p:panel header="#{msg.demandas}" id="demandas">
				<p:dataTable id="listadoDemandas"
					value="#{demandasBean.demandasDeDepartamentos}" var="demandaVar"
					emptyMessage="#{msg.tablaVacia}" paginator="true" rows="10"
					rowEditListener="#{demandasBean.updateDemanda}">
					<p:column style="width:70px">
						<p:commandLink value="#{msg.aniadirIntervencion}"
							onclick="addIntervenciondlg.show();"
							update="addIntervenciondlgPanel">
							<f:setPropertyActionListener
								target="#{demandasBean.demandaSeleccionada}"
								value="#{demandaVar}"></f:setPropertyActionListener>
						</p:commandLink>
					</p:column>
					<p:column headerText="#{msg.estado}" style="width:70px"
						sortBy="#{demandaVar.estado}">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{demandaVar.estado}" />
							</f:facet>
							<f:facet name="input">
								<h:selectOneMenu value="#{demandaVar.estado}">
									<f:selectItem itemLabel="#{msg.activa}" itemValue="Activa" />
									<f:selectItem itemLabel="#{msg.solucionada}" itemValue="Solucionada" />
									<f:selectItem itemLabel="#{msg.archivada}" itemValue="Archivada" />
								</h:selectOneMenu>
							</f:facet>
						</p:cellEditor>
					</p:column>
					<p:column headerText="#{msg.fechaCreacion}" style="width:70px"
						sortBy="#{demandaVar.fechaCreacion}">
						<h:outputText value="#{demandaVar.fechaCreacion}" />
					</p:column>
					<p:column headerText="#{msg.ultimaModificacion}" style="width:70px"
						sortBy="#{demandaVar.fechaModificacion}">
						<h:outputText value="#{demandaVar.fechaModificacion}" />
					</p:column>
					<p:column headerText="#{msg.tecnico}" style="width:100px">
						<h:outputText
							value="#{demandaVar.tecnicoBean.nombre} #{demandaVar.tecnicoBean.apellidos}" />
					</p:column>
					<p:column headerText="#{msg.usuario}" style="width:100px">
						<h:outputText
							value="#{demandaVar.usuarioBean.nombre} #{demandaVar.usuarioBean.apellidos}" />
					</p:column>
					<p:column headerText="#{msg.descripcion}" style="width:200px">
						<p:cellEditor>
							<f:facet name="output">
								<h:outputText value="#{demandaVar.descripcion}" />
							</f:facet>
							<f:facet name="input">
								<p:inputTextarea value="#{demandaVar.descripcion}"
									autoResize="false"></p:inputTextarea>
							</f:facet>
						</p:cellEditor>
					</p:column>
					<p:column headerText="#{msg.documentos}" style="width:100px">
						<p:cellEditor>
							<f:facet name="output">
								<ui:repeat var="documentoVar" value="#{demandaVar.documentos}">
									<p:commandLink value="#{documentoVar.tipo}"
										action="#{demandasBean.descargarArchivo}" ajax="false">
										<f:setPropertyActionListener target="#{demandasBean.path}"
											value="#{documentoVar.demandaBean.idDemanda},#{documentoVar.tipo}"></f:setPropertyActionListener>
									</p:commandLink>
									<br />
								</ui:repeat>
							</f:facet>
							<f:facet name="input">
								<h:panelGroup>
									<p:commandLink value="#{msg.aniadirDoc}"
										oncomplete="addDocumendosDlg.show();">
										<f:setPropertyActionListener
											target="#{demandasBean.demandaAmodificar}"
											value="#{demandaVar}"></f:setPropertyActionListener>
									</p:commandLink>
									<br />
									<ui:repeat var="documentoVar" value="#{demandaVar.documentos}"
										id="documentos">
										<h:panelGroup id="listaDocumentos" style="border:none;">
											<h:outputText value="#{documentoVar.tipo}" />
											<p:commandLink title="#{msg.eliminar}"
												onclick="documentoDlg.show();">
												<p:graphicImage value="../images/buttons/delete.png"
													width="10" height="10"></p:graphicImage>
												<f:setPropertyActionListener
													target="#{demandasBean.documentoAEliminar}"
													value="#{documentoVar}"></f:setPropertyActionListener>
											</p:commandLink>
											<br />
										</h:panelGroup>
									</ui:repeat>
								</h:panelGroup>
							</f:facet>
						</p:cellEditor>
					</p:column>
					<p:column headerText="#{msg.opciones}" style="width:50px">
						<p:rowEditor />
					</p:column>
				</p:dataTable>
				<p:confirmDialog message="#{msg.eliminarDocumento}"
					widgetVar="documentoDlg" id="documentoDlg" header="#{msg.confirmacion}"
					modal="true">
					<h:panelGrid columns="2">
						<p:commandButton update="@form"
							action="#{demandasBean.eliminarDocumento}" value="#{msg.si}"
							oncomplete="documentoDlg.hide();"></p:commandButton>
						<p:commandButton value="#{msg.no}" oncomplete="documentoDlg.hide();"></p:commandButton>
					</h:panelGrid>
				</p:confirmDialog>
				<p:dialog id="addDocumendosDlg" modal="true"
					widgetVar="addDocumendosDlg" header="#{msg.aniadirDoc}">
					<h:panelGrid id="addDocumentos" columns="2">
						<p:fileUpload label="#{msg.subirArchivos}"
							sizeExceedMessage="#{msg.ficheroGrande}"
							fileUploadListener="#{demandasBean.handleFileUpload}"
							mode="advanced" multiple="true" auto="true"
							update="msgs,documentosNuevos,listaDocumentosNuevos,addDocumentos"
							sizeLimit="10000000" />
						<ui:repeat var="documentoVar1"
							value="#{demandasBean.nombresDocumentos}" id="documentosNuevos">
							<h:panelGrid columns="2" id="listaDocumentosNuevos">
								<h:outputText value="#{documentoVar1}" />
								<p:commandLink title="#{msg.eliminar}"
									action="#{demandasBean.quitarDocumento}"
									update="documentosNuevos,listaDocumentosNuevos,addDocumentos">
									<p:graphicImage value="../images/buttons/delete.png" width="16"
										height="16"></p:graphicImage>
									<f:setPropertyActionListener target="#{demandasBean.documento}"
										value="#{documentoVar1}"></f:setPropertyActionListener>
								</p:commandLink>
								<br />
							</h:panelGrid>
						</ui:repeat>
						<p:commandButton update="@form"
							action="#{demandasBean.guardarDocumentos}" value="#{msg.guardar}"
							oncomplete="addDocumendosDlg.hide();"></p:commandButton>
						<p:commandButton value="#{msg.cancelar}"
							oncomplete="addDocumendosDlg.hide();"></p:commandButton>
					</h:panelGrid>
				</p:dialog>
				<p:dialog id="addIntervenciondlg" modal="true" width="450"
					height="330" widgetVar="addIntervenciondlg"
					header="#{msg.aniadirIntervencion}">
					<h:panelGrid columns="2" id="addIntervenciondlgPanel">
						<h:outputText value="#{msg.adjuntar}: "></h:outputText>
						<h:panelGroup id="nuevaIntervencion">
							<p:fileUpload label="#{msg.subirArchivos}"
								sizeExceedMessage="#{msg.ficheroGrande}"
								fileUploadListener="#{intervencionesBean.handleFileUpload}"
								mode="advanced" multiple="true" auto="true"
								update="nuevaIntervencion,documentosDlg,listaDocumentosDlg"
								sizeLimit="10000000" />
							<ui:repeat var="documentoVar"
								value="#{intervencionesBean.nombresDocumentos}"
								id="documentosDlg">
								<h:panelGrid columns="2" id="listaDocumentos">
									<h:outputText value="#{documentoVar}" />
									<p:commandLink title="#{msg.eliminar}"
										action="#{intervencionesBean.quitarDocumento}"
										update="nuevaIntervencion,documentos,listaDocumentosDlg">
										<p:graphicImage value="../images/buttons/delete.png"
											width="16" height="16"></p:graphicImage>
										<f:setPropertyActionListener
											target="#{intervencionesBean.documento}"
											value="#{documentoVar}"></f:setPropertyActionListener>
									</p:commandLink>
								</h:panelGrid>
							</ui:repeat>
						</h:panelGroup>

						<h:outputText value="#{msg.usuario}: "></h:outputText>
						<h:outputText
							value="#{intervencionesBean.demanda.usuarioBean.nombre} #{intervencionesBean.demanda.usuarioBean.apellidos}"></h:outputText>
						<h:outputText value="#{msg.tecnico}: "></h:outputText>
						<h:outputText
							value="#{intervencionesBean.currentTecnico.nombre} #{intervencionesBean.currentTecnico.apellidos}"></h:outputText>
						<h:outputText value="#{msg.fecha}:"></h:outputText>
						<p:calendar pattern="dd/MM/yyyy" effect="drop" locale="es"  yearRange="c-99:c"
							style="width:156px" value="#{intervencionesBean.fecha}">
						</p:calendar>
						<h:outputText value="#{msg.tipo}: "></h:outputText>
						<p:inputTextarea autoResize="false"
							value="#{intervencionesBean.intervencion.tipo}"></p:inputTextarea>
						<h:outputText value="#{msg.observaciones}: "></h:outputText>
						<p:inputTextarea autoResize="false"
							value="#{intervencionesBean.intervencion.observaciones}"></p:inputTextarea>
						<p:commandButton update="demandas,listadoDemandas"
							action="#{intervencionesBean.addIntervencion}" value="#{msg.guardar}"
							onclick="addIntervenciondlg.hide();"></p:commandButton>
						<p:commandButton value="#{msg.cancelar}"
							oncomplete="addIntervenciondlg.hide();"></p:commandButton>
					</h:panelGrid>
				</p:dialog>
			</p:panel>
		</h:form>


	</ui:define>
</ui:composition>